/**
 * @author 14544
 * @date 2020/3/26 11:15
 */
let TEST_URL = '/gov/gov.do?methodname=queryDocStatuses&serviceid=gov_status';
// 实现一个具有加载进度的请求
{
    let xhr = new window.XMLHttpRequest();

    let url = '/gov/gov.do?serviceid=gov_site&methodname=queryChildrenChannelsOnEditorCenter&SITEID=1212&ParentChannelId=17275&PAGESIZE=1000';

    // 要传递诸如 ?name=value 这样的 URL 参数，并确保参数被正确编码，我们可以使用 URL 对象：
    // let urlOther = new URL('http://localhost:8080/gov/gov.do'); // 这里传入的url必须是一个绝对url地址
    // urlOther.searchParams.set('serviceid','gov_stie');
    // urlOther.searchParams.set('methodname','queryChildrenChannelsOnEditorCenter');
    // urlOther.searchParams.set('SITEID','1212');
    // urlOther.searchParams.set('ParentChannelId','17275');
    // urlOther.searchParams.set('PAGESIZE','1000');

    xhr.open('GET', url, true);

    // 请求成功
    xhr.onload = function () {
        console.log(`loaded status:${xhr.status}`) // HTTP 状态码（一个数字）：200，404，403 等等，如果出现非 HTTP 错误，它的结果为 0。
        console.log(window.JSON.parse(xhr.response || xhr.responseText)) // 兼容以前的写法 可以返回responseText
    };

    // 请求失败 非 HTTP 错误
    xhr.onerror = function () {
        console.log(`fail status:${xhr.status}`)
    };

    xhr.timeout = 5000; // 设置超时时间100ms，请求超过100ms时，会自动取消请求，同时出发timeout事件

    // 请求超时
    xhr.ontimeout = function () {
        console.log(`timeout status:${xhr.status}`)
    };

    // 请求的进度
    // event.lengthComputable - 当服务器返回了 Content-Length 响应头时,该值为true
    // event.loaded - 已经下载了多少字节
    // event.total - 总字节数（如果 lengthComputable 为 true）
    xhr.onprogress = function (event) {
        console.log(`progress status:${xhr.status}`)
        if (event.lengthComputable) { // 响应头返回有 Content-length时
            console.log(`Received ${event.loaded} of ${event.total} bytes: ${event.loaded / event.total * 100 + '%'}`)
        } else {
            console.log(`Received ${event.loaded} bytes`)
        }
    };

    // 发送请求
    xhr.send(null);
}
